<template>
  <div>我是子组件{{data.msg}}--{{data.age}}</div>
  <button @click="talkToFather">自组件通知父组件</button>
</template>

<script lang="ts">
import { ref } from 'vue'
export default {
  name: 'content',
  props: {
    msg: String,
    age: ''
  },
  setup(props, context) {
    let data = ref(props)

    function talkToFather() {
      // setup 在onload 和 creat 之间，没有this  所以使用context
      console.log('----data', data)
      context.emit('showName', '我是' + data.value.msg)
    }
    return { data, talkToFather }
  }
}

</script>

<style scoped>
a {
  color: #42b983;
}
</style>
